<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ajax</title>
    <script src="../../springMVC0927/src/main/webapp/js/jquery-1.42.min.js"></script>
    <script>
        $(function () {
            $("#username").blur(function () {
              // 发送异步请求 jQuery中的ajax $.get()  $.post()  $.ajax()
                $.get("/day39/user/checkUser.action",
                    {"username": $("#username").val()},
                    function (data1) {
                    // alert(data)
                        var s = JSON.stringify(data1)
                        alert(data1)
                        $("#userMessage").text(s)
                    },
                    "text")
            })
            $("#phone").blur(function () {
                $.post("/day39/user/checkPhone.action",
                    {"phone": $("#phone").val()},
                    function (data) {
                        alert(data)
                        var s = JSON.stringify(data)
                        alert(s)
                        alert(data.statusNO)
                        alert(data.message)
                        alert(data.data)
                        $("#phoneMessage").text(data.message)
                    },
                    "json")
            })
            $("#email").blur(function (){
                $.ajax({
                    async:true,
                    data:{"email":$("#email").val()},
                    dataType:"json",
                    success:function (result){
                        if(result.message==="邮箱已注册"){
                            $("#emailMessage").text("该邮箱不可用");
                            $("#emailMessage").css("color","red");
                        }else if(result.message==="该邮箱可用"){
                            $("#emailMessage").text("该邮箱可用");
                            $("#emailMessage").css("color","green");
                        }
                    },
                    error:function (){
                        alert("异步请求失败");
                    },
                    type:"post",//请求方式设置为put
                    url:"/day39/user/checkEmail.action",
                    }

                )
            })
        })
    </script>
</head>
<body>
<form action="/day39/user/registerUser.action" method="post">
    <input type="text" id="username" name="username" placeholder="用户名"/><span id="userMessage"></span><br>
    <input type="number" id="phone" name="phone" placeholder="请输入手机号"/><span id="phoneMessage"></span><br>
    <input type="email" id="email" name="email" placeholder="请输入邮箱"/><span id="emailMessage"></span><br>
    <input type="submit" value="注册">
</form>
<script type="text/javascript">
    $(function(){
        $("#b2").click(function(){
            $("#b1").click();
        });});
    function change(){
        alert("调用了方法change");
    }

</script>
<button id = "b1" onclick="change()">按钮1</button>
<button id = "b2">按钮2</button>
</body>
</html>